<template>
	<view class="page">
		<view class="list">
			<view class="item" @tap="editRow">
				<text class="key">原密码</text>
				<text class="value">{{noSeeRow}}</text>
			</view>
			<view class="item" @tap="editNew">
				<text class="key">新密码</text>
				<text class="value">{{noSeeNew}}</text>
			</view>
			<view class="item" @tap="editNewRepeat">
				<text class="key">重复新密码</text>
				<text class="value">{{noSeeRepeat}}</text>
			</view>		
			<view class="register-desc">
				设置的新密码的长度为4-8位，密码长度为4-8位并且只能是纯数字，纯字母或数字和字母的混合组成，如果忘记原密码请即时联系相关负责人进行密码重置
			</view>
		</view>
		<uni-popup ref="popupRow" type="dialog">
			<uni-popup-dialog mode="input" title="原密码" :value="rowpass" placeholder="原密码" @confirm="finishRow">
			</uni-popup-dialog>
		</uni-popup>
		<uni-popup ref="popupNew" type="dialog">
			<uni-popup-dialog mode="input" title="新密码" :value="newpass" placeholder="新密码" @confirm="finishNew">
			</uni-popup-dialog>
		</uni-popup>
		<uni-popup ref="popupNewRepeat" type="dialog">
			<uni-popup-dialog mode="input" title="重复新密码" :value="repeatpass" placeholder="重复新密码" @confirm="finishNewRepeat">
			</uni-popup-dialog>
		</uni-popup>
		<button class="save-btn" @tap="save">确定</button>
	</view>
</template>

<script>
	import uniPopup from '@/components/uni-popup/uni-popup.vue';
	import uniPopupMessage from '@/components/uni-popup/uni-popup-message.vue';
	import uniPopupDialog from '@/components/uni-popup/uni-popup-dialog.vue';

	export default {
		components: {
			uniPopup,
			uniPopupMessage,
			uniPopupDialog,
		},
		data() {
			return {
				noSeeRow:'************',
				noSeeNew:'************',
				noSeeRepeat:'************',
				rowpass: '',
				newpass: '',
				repeatpass: '',
				flag:null,
				opt: null
			}
		},
		methods: {
			editRow: function() {
				this.$refs.popupRow.open();
			},
			finishRow: function(done, value) {
				let that = this;
				if (!this.checkValidPassword(value, '原密码')) {
					that.ajax(that.url.validPassword, 'POST',{
						password:value
					}, function(resp) {
						let data = resp.data;
						if(data.result){
							that.rowpass=value;
							let str = '';
							for(let i=0;i<that.rowpass.length;i++){
								str+='*'
							}
							that.noSeeRow = str;
							that.flag = 1;
							done();
						}else{
							uni.showToast({
								title: data.msg,
								icon: 'error'
							});
							that.rowpass = '';
							that.noSeeRow='************';
						}
					});
				}
			},
			editNew: function() {
				if(this.rowpass===''){
					uni.showToast({
						title: "请先填写原密码",
						icon: 'error'
					});
					return
				}
				this.$refs.popupNew.open();
			},
			finishNew: function(done, value) {
				let that = this;
				if (!this.checkValidPassword(value, '新密码')) {
					that.newpass=value;
					let str = '';
					for(let i=0;i<that.newpass.length;i++){
						str+='*'
					}
					that.noSeeNew = str;
					that.flag = 2;
					done();
				}
			},
			editNewRepeat: function() {
				if(this.newpass===''){
					uni.showToast({
						title: "请先填写新密码",
						icon: 'error'
					});
					return
				}
				this.$refs.popupNewRepeat.open();
			},
			finishNewRepeat: function(done, value) {
				let that = this;
				if (!this.checkValidPassword(value, '重复新密码')) {
					that.repeatpass = value;
				}
				if(that.newpass!==that.repeatpass){
					uni.showToast({
						title: '两次密码输入不一致',
						icon: 'error'
					});
					that.repeatpass = '';
					noSeeRepeat = '************';
				}
				let str = '';
				for(let i=0;i<that.repeatpass.length;i++){
					str+='*'
				}
				that.noSeeRepeat = str;
				that.flag=3;
				if(that.flag==3){
					that.opt = 'modified'
				}
				done();
			},
			save: function() {
				let that = this;
				if (that.opt == 'modified') {
					if (that.checkValidPassword(that.rowpass, '原密码') ||
						that.checkValidPassword(that.newpass, '新密码') ||
						that.checkValidPassword(that.repeatpass, '重复新密码') ) {
						return;
					}
					uni.showModal({
						title: '提示',
						content: '是否确认修改密码',
						success: function(e) {
							if (e.confirm) {
								that.ajax(that.url.updatePassword, 'PUT', {
									password:that.newpass
								}, function(resp) {
									let data = resp.data;
									uni.showToast({
										icon: 'success',
										title: "修改成功",
									});
									setTimeout(function(){
										uni.removeStorageSync("token");
										uni.navigateTo({
											url: "../login/login"
										})
									},2000)
								});
							}else{
								that.rowpass='';
								that.newpass='';
								that.repeatpass='';
								that.flag = null;
								that.opt=null;
							}
						}
					});
				}else{
					uni.showToast({
						icon: 'error',
						title: '请填写相关内容',
					});
				}
			}
		}
	}
</script>

<style lang="less">
	@import url("modified_password.less");
</style>
